<template>
  <div>
    <my-breadcrumb :items="['统计分析', '资讯统计']"/>
    <div id="type" style="height: 400px;width: 100%;"></div>
    <div id="style" style="height: 400px;width: 100%;"></div>
    <div id="brand" style="height: 400px;width: 100%;"></div>
  </div>
</template>

<script>
import CLAZZ from '@/config/classify'
let echarts = require('echarts/lib/echarts')
require('echarts/lib/chart/bar')
require('echarts/lib/component/tooltip')
require('echarts/lib/component/legend')
require('echarts/lib/component/title')
export default {
  name: 'news-count',
  data () {
    return {}
  },
  methods: {
    // /Statistics/getPlacard
    getTypeCount () {
      let styleChart = echarts.init(document.getElementById('type'), 'light')
      let option = {
        title: [
          {
            text: '资讯类型统计'
          }
        ],
        tooltip: {},
        legend: {
        },
        xAxis: {
          data: []
        },
        yAxis: {
          name: '资讯数（条）'
        },
        series: [{
          name: '资讯数',
          type: 'bar',
          data: []
        }]
      }
      this.axios.get('/Statistics/getPlacard')
        .then(res => {
          if (res.data.status === 1) {
            res.data.data.forEach(item => {
              option.xAxis.data.push(CLAZZ.news[item.typeid - 1].name)
              option.series[0].data.push(item.num)
            })
            styleChart.setOption(option)
          }
        })
    },
    getStyleCount () {
      let styleChart = echarts.init(document.getElementById('style'), 'light')
      let option = {
        title: [
          {
            text: '资讯风格统计'
          }
        ],
        tooltip: {},
        legend: {
        },
        xAxis: {
          data: []
        },
        yAxis: {
          name: '资讯数（条）'
        },
        series: [{
          name: '资讯数',
          type: 'bar',
          data: []
        }]
      }
      this.axios.get('/Statistics/getPlacard?type=2')
        .then(res => {
          if (res.data.status === 1) {
            res.data.data.forEach(item => {
              option.xAxis.data.push(CLAZZ.style[item.styleid - 1].name)
              option.series[0].data.push(item.num)
            })
            styleChart.setOption(option)
          }
        })
    },
    getBrandCount () {
      let styleChart = echarts.init(document.getElementById('brand'), 'light')
      let option = {
        title: [
          {
            text: '资讯品牌统计'
          }
        ],
        tooltip: {},
        legend: {
        },
        xAxis: {
          data: []
        },
        yAxis: {
          name: '资讯数（条）'
        },
        series: [{
          name: '资讯数',
          type: 'bar',
          data: []
        }]
      }
      this.axios.get('/Statistics/getPlacard?type=3')
        .then(res => {
          if (res.data.status === 1) {
            res.data.data.forEach(item => {
              option.xAxis.data.push(CLAZZ.brand[item.brandid - 1].name)
              option.series[0].data.push(item.num)
            })
            styleChart.setOption(option)
          }
        })
    }
  },
  mounted () {
    this.getTypeCount()
    this.getStyleCount()
    this.getBrandCount()
  },
  created () {
  }
}
</script>

<style scoped>

</style>
